<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>登录系统</title>
    <meta name="description" content="后台管理框架">
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
    <!-- 360浏览器急速模式 -->
    <meta name="renderer" content="webkit">
    <link th:href="@{/foo/css/login.min.css}" rel="stylesheet">
    <style>
        .input-group-flat:focus-within a {
            border-color: #90b5e2!important;
        }
        .bgImage{
            background-image: url('https://youleng.oss-cn-wulanchabu.aliyuncs.com/youleng/1742782868557.jpg');
            background-size: cover; /* 背景图片填充整个元素 */
            background-repeat: no-repeat; /* 防止背景图片重复 */
            background-position: center; /* 将背景图片居中 */
            height: 100vh; /* 设置body高度为视口高度 */
            margin: 0; /* 去除默认的body边距 */
        }
    </style>
    <style type="text/css">
        label.error {
            position: inherit;
            color: #ff000094;
            font-size: 10px;
        }
    </style>
    <script>
        if(window.top!==window.self){alert('未登录或登录超时。请重新登录');window.top.location=window.location};
    </script>
</head>
<body class=" d-flex flex-column">
<div class="page page-center bgImage">
    <div class="container container-tight py-4">
        <div class="text-center mb-4">
            <a href="." class="navbar-brand navbar-brand-autodark">
                <img src="../static/foo.png"  th:src="@{/foo.png}" width="110" height="32" alt="表格" class="navbar-brand-image">
            </a>
        </div>
        <div class="card card-md">
            <div class="card-body">
                <h2 class="h2 text-center mb-4">登录您的账户</h2>
                <form id="signupForm" autocomplete="off"  novalidate="">
                    <div class="mb-3">
                        <label class="form-label">用户名</label>
                        <input type="text" name="username" class="form-control" placeholder="用户名" value="admin" autocomplete="off">
                    </div>
                    <div class="mb-3">
                        <label class="form-label"><font>密码</font></label>
                        <input type="password" name="password" class="form-control" placeholder="您的密码" value="admin" autocomplete="off">
                    </div>
                    <div th:if="${captchaEnabled==true}" class="mb-2">
                        <label class="form-label"><font>验证码</font>
                        </label>
                        <div class="input-group input-group-flat">
                            <input type="text" name="validateCode" class="form-control" placeholder="验证码" autocomplete="off">
                            <a class="focus-within" style=" border: var(--tblr-border-width) solid var(--tblr-border-color); " href="javascript:void(0);" title="点击更换验证码">
                                <img style=" height: 40px; margin-left: 19px; " th:src="@{captcha/captchaImage(type=${captchaType})}" class="imgcode" width="85%"/>
                            </a>
                        </div>
                    </div>
                    <!--                    <div class="checkbox-custom" th:classappend="${captchaEnabled==false} ? 'm-t'">-->
                    <!--                        <label class="form-check">-->
                    <!--                            <input  id="rememberme" name="rememberme" type="checkbox" class="form-check-input">-->
                    <!--                            <span class="form-check-label">在此设备上记住我</span>-->
                    <!--                        </label>-->
                    <!--                    </div>-->
                    <div class="form-footer">
                        <button type="submit" id="btnSubmit" data-loading="正在验证登录，请稍后..." class="btn btn-primary w-100">登录</button>
                    </div>
                </form>
            </div>
        </div>
        <div th:if="${@config.getKey('sys.account.registerUser')}" class="text-center text-secondary mt-3"><font _mstmutation="1" _msttexthash="37877853" _msthash="14">还没有帐户？<a  th:href="@{/register}" tabindex="-1" _mstmutation="1" _istranslated="1">登记</a></font>
        </div>
    </div>

</div>
<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; </script>
<!-- 全局js -->
<script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
<script src="../static/js/bootstrap.min.js" th:src="@{/js/bootstrap.min.js}"></script>
<!-- 验证插件 -->
<script src="../static/ajax/libs/validate/jquery.validate.min.js" th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>
<script src="../static/ajax/libs/validate/messages_zh.min.js" th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script>
<script src="../static/ajax/libs/layer/layer.min.js" th:src="@{/ajax/libs/layer/layer.min.js}"></script>
<script src="../static/ajax/libs/blockUI/jquery.blockUI.js" th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script>
<script src="../static/foo/js/ry-ui.js" th:src="@{/foo/js/ry-ui.js?v=4.2.0}"></script>
<script src="../static/foo/login.js" th:src="@{/foo/login.js}"></script>
</body>
</html>
